<!DOCTYPE html>
<html>

<head lang="en">
<meta charset="UTF-8">
<title>登录</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport"
	content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
<meta name="format-detection" content="telephone=no">
<meta name="renderer" content="webkit">
<meta http-equiv="Cache-Control" content="no-siteapp" />

<link rel="stylesheet" href="../../js/AmazeUI-2.4.2/assets/css/amazeui.css" />
<link href="../../css/dlstyle.css" rel="stylesheet" type="text/css">
<script src="../../js/jquery/jquery.min.js" charset="utf-8"></script>
<script
	src="../../js/jquery/jquery.validation/jquery-validation-1.14.0/lib/jquery.js"></script>
<script
	src="../../js/jquery/jquery.validation/jquery-validation-1.14.0/dist/jquery.validate.min.js"></script>
<script
	src="../../js/jquery/jquery.validation/jquery-validation-1.14.0/dist/localization/messages_zh.js"></script>
</head>

<body>
	<div class="login-boxtitle">
		<a href="home.html"><img alt="logo" src="../../images/logobig.png" /></a>
	</div>

	<div class="login-banner">
		<div class="login-main">
			<div class="login-banner-bg">
				<span></span><img src="../../images/big.jpg" />
			</div>
			<div class="login-box">

				<h3 class="title">登录商城</h3>

				<div class="clear"></div>

				<div class="login-form">
					<form id="login">
						<div class="user-name">
							<label for="username"><i class="am-icon-user"></i></label> <input
								type="text" name="username" id="username"
								placeholder="邮箱/手机/用户名">
						</div>
						<div class="user-pass">
							<label for="password"><i class="am-icon-lock"></i></label> <input
								type="password" name="password" id="password"
								placeholder="请输入密码">
						</div>

						<div class="user-name">
							<label for="password"><i class="am-icon-tasks"></i></label> <input
								type="text" name="code" id="code" placeholder="验证码"> <img
								style="width: 60px; height: 42px; float: right" id="codeImg"
								src="" alt="验证码">
						</div>

					</form>
				</div>

				<div class="login-links">
					<label for="remember-me"><input id="remember-me"
						type="checkbox">记住密码</label> <a href="#" class="am-fr">忘记密码</a> <a
						href="register.html" class="zcnext am-fr am-btn-default">注册</a> <br />
				</div>
				<div class="am-cf">
					<input type="submit" id="loginbut" name="loginbut" value="登 录"
						class="am-btn am-btn-primary am-btn-sm">
				</div>
				<div class="partner">
					<h3>合作账号</h3>
					<div class="am-btn-group">
						<li><a href="#"><i class="am-icon-qq am-icon-sm"></i><span>QQ登录</span></a></li>
						<li><a href="#"><i class="am-icon-weibo am-icon-sm"></i><span>微博登录</span>
						</a></li>
						<li><a href="#"><i class="am-icon-weixin am-icon-sm"></i><span>微信登录</span>
						</a></li>
					</div>
				</div>

			</div>
		</div>
	</div>


	<div class="footer ">
		<div class="footer-hd ">
			<p>
				<a href="# ">恒望科技</a> <b>|</b> <a href="# ">商城首页</a> <b>|</b> <a
					href="# ">支付宝</a> <b>|</b> <a href="# ">物流</a>
			</p>
		</div>
		<div class="footer-bd ">
			<p>
				<a href="# ">关于恒望</a> <a href="# ">合作伙伴</a> <a href="# ">联系我们</a> <a
					href="# ">网站地图</a> <em>? 2015-2025 Hengwang.com 版权所有</em>
			</p>
		</div>
	</div>
</body>
<script>
	//异步表单提交
	var getUser = function() {
		$.ajax({
			type : "post",
			dataType : "json",
			url : "/user/login",
			data : {
				"name" : $("#username").val(),
				"pwd" : $("#password").val()
			//向服务端传的参数，此处只是演示
			},
			success : function(msg) {
				location.href="/cate/getfirstcate";
			}
		});
	}
	$("#loginbut").on('click', function() {
		getUser();
	});
	
	//验证码校验
	$(document).ready(function() {
		changeCode();
		$("#codeImg").bind("click", changeCode);
	});
	function genTimestamp() {
		var time = new Date();
		return time.getTime();
	}
	function changeCode() {
		$("#codeImg").attr("src", "/admin/randomCode?t=" + genTimestamp());
	}
	//表单提交验证，校验表单
	var validform = function() {
		return $("#login").validate({
			rules : {
				username : {
					required : true
				},
				password : {
					required : true
				}
			},
			messages : {
				username : {
					required : ""
				},
				password : {
					required : ""
				}
			}
		});

	}
	// 在键盘按下并释放及提交后验证提交表单，不是全部填写完成点提交才显示提示信息的
	$().ready(function() {
		validform();
	});

		
</script>
</html>
